import 'package:card_swiper/card_swiper.dart';
import 'package:flutter/widgets.dart';
import 'package:lib_uikit/lib_uikit.dart';
import 'gt_rect_swiper_pagination_builder.dart';

/// @Title   卡片堆叠式的banner（指示器在外部）
/// to fix 手势交互时停止滚动的问题
/// @Author: bryce
/// @CreateDate: 2023年08月31日13:51:43
class GTCardStackBanner extends StatelessWidget {
  /// 卡片的宽高
  final double cardWidth;
  final double cardHeight;

  /// 根据index创建item
  final IndexedWidgetBuilder itemBuilder;

  /// banner页数
  final int itemCount;

  /// 默认第几页
  final int index;

  /// 是否自动滚动
  final bool autoplay;

  /// 是否循环滚动
  final bool loop;

  /// 自动滚动时间间隔 (in millisecond).
  final int autoplayDelay;

  /// 页面切换事件
  final ValueChanged<int>? onIndexChanged;

  /// 点击事件
  final SwiperOnTap? onTap;

  /// 控制器
  final SwiperController? controller;

  const GTCardStackBanner(
      {super.key,
        required this.cardWidth,
        required this.cardHeight,
        required this.itemCount,
        required this.itemBuilder,
        this.controller,
        this.onIndexChanged,
        this.onTap,
        this.autoplay = true,
        this.loop = true,
        this.autoplayDelay = 3000,
        this.index = 0});

  @override
  Widget build(BuildContext context) {
    if (itemCount == 0) return Container();
    return SizedBox(
      width: cardWidth,
      child: Swiper(
        index: index,
        autoplay: itemCount == 1 ? false : autoplay,
        autoplayDelay: autoplayDelay,
        loop: itemCount == 1 ? false : loop,
        itemCount: itemCount,
        itemBuilder: itemBuilder,
        onIndexChanged: onIndexChanged,
        onTap: onTap,
        axisDirection: GTThemeProvider.instance.isRTL() ? AxisDirection.left : AxisDirection.right,
        containerWidth: cardWidth,
        itemWidth: cardWidth,
        itemHeight: cardHeight,
        layout: SwiperLayout.TINDER,
        outer: true,
        controller: controller,
        pagination: itemCount == 1
            ? null
            : SwiperPagination(
            builder: GTRectSwiperPaginationBuilder(
                activeColor: GTColorsV3.uikitNeutral1V3.color,
                color: GTColorsV3.uikitNeutral1V3.color.withOpacity(0.2),
                space: 4,
                activeSize: const Size(12, 4),
                size: const Size(4, 4))),
      ),
    );
  }
}

